<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 
         border-radius  圆角
            一个值表示的是四个角
            二个值表示的是左上右下 右上左下（对角）
            三个值表示的是左上 右上左下 右下
            四个值表示的是顺时针
            
            水平半径/垂直半径

            不简写
                border-上下-左右-radius

     -->
    <style>
        .all{
            width:300px; height:300px;
            /* background: red; */
/* 
            border-style: solid dashed dotted none;
            border-color: red blue;
            border-width: 10px 20px; */
            border: solid 10px red;
            /* border-radius: 20px 40px 60px 90px/10px 20px 40px 20px;
            border-top-right-radius:40px; */
            border-radius: 50%;
        }
    </style>
</head>
<body>
   <div class="all"></div> 
</body>
</html>